import * as echarts from 'echarts';

export const base_line= (salaryYears, jobId,averageSalary)=> {

    const myChart = echarts.init(document.getElementById("main_line"));

    let option;
    // eslint-disable-next-line prefer-const
    option = {
        title: {
            text: "根据学历经验筛选的年薪折线图",
            left: 'center'
        },
        // 添加 tooltip 配置
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                type: 'cross',
                crossStyle: {
                    color: '#999'
                }
            },
        },
        toolbox: {
            feature: {
                dataView: { show: true, readOnly: false },
                magicType: { show: false }, // 可能不需要切换图表类型的功能
                restore: { show: true },
                saveAsImage: { show: true }
            }
        },
        legend: {
            data: ['岗位id', '平均年薪']
        },
        xAxis: {
            type: 'category',
            name:"岗位id",
            data: jobId, // 使用提取出的salaryYears作为X轴数据
            axisLabel: {
                formatter: '{value}'
            },
            axisPointer: {
                type: 'shadow'
            }
        },
        yAxis: {
            type: 'value',
            name:"年薪（K）",
            axisLabel: {
                formatter: '{value} K'
            }
        },
        series: [
            {
                data: salaryYears, // 使用提取出的salaries作为Y轴数据
                type: 'line'
            },
            {
                // 新增系列代表平均薪资的直线
                data: [averageSalary], // 注意这里是一个数组，因为 ECharts 需要一个数据点列表，即使只有一个点
                type: 'line',
                name: '平均薪资', // 系列名称，会在图例中显示
                symbol: 'none', // 不显示数据点符号
                lineStyle: {
                    color: 'green', // 线条颜色为绿色
                    width: 2, // 可选：线条宽度
                    type: 'dashed' // 可选：线条样式，如 dashed 为虚线
                },

                grid: { containLabel: true },
                markLine: { // 标记线，用于强调平均值位置
                    data: [{type: 'average', name: '平均薪资（K）'}],
                    lineStyle: {
                        color: 'green',
                        width: 1,
                        type: 'solid'
                    },
                    label: {
                        show: true,
                        position: 'end',
                        formatter: `{b}: {c}`
                    }
                }
            }
        ]
    };
    myChart.setOption(option);
    myChart.resize();
    window.addEventListener('resize', () => myChart.resize);
}

export const recruit_line= (salaryYears,jobId,averageSalary,pre_rank_100,roleListNum)=> {

    const myChart = echarts.init(document.getElementById("main_line"));

    let option;
    // eslint-disable-next-line prefer-const
    option = {
        title: {
            text: "根据岗位筛选的年薪折线图",
            subtext: "相同需求的岗位有"+roleListNum+"个，此薪资在这些岗位中处在"+pre_rank_100+"%的位置",
            left: 'center'
        },
        // 添加 tooltip 配置
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                type: 'cross',
                crossStyle: {
                    color: '#999'
                }
            },
        },
        toolbox: {
            feature: {
                dataView: { show: true, readOnly: false },
                magicType: { show: false }, // 可能不需要切换图表类型的功能
                restore: { show: true },
                saveAsImage: { show: true }
            }
        },
        legend: {
            data: ['岗位id', '平均年薪']
        },
        xAxis: {
            type: 'category',
            name:"岗位id",
            data: jobId, // 使用提取出的salaryYears作为X轴数据
            axisLabel: {
                formatter: '{value}'
            },
            axisPointer: {
                type: 'shadow'
            }
        },
        yAxis: {
            type: 'value',
            name:"年薪（K）",
            axisLabel: {
                formatter: '{value} K'
            }
        },
        series: [
            {
                data: salaryYears, // 使用提取出的salaries作为Y轴数据
                type: 'line'
            },
            {
                // 新增系列代表平均薪资的直线
                data: [averageSalary], // 注意这里是一个数组，因为 ECharts 需要一个数据点列表，即使只有一个点
                type: 'line',
                name: '平均薪资', // 系列名称，会在图例中显示
                symbol: 'none', // 不显示数据点符号
                lineStyle: {
                    color: 'green', // 线条颜色为绿色
                    width: 2, // 可选：线条宽度
                    type: 'dashed' // 可选：线条样式，如 dashed 为虚线
                },

                grid: { containLabel: true },
                markLine: { // 标记线，用于强调平均值位置
                    data: [{type: 'average', name: '平均薪资（K）'}],
                    lineStyle: {
                        color: 'green',
                        width: 1,
                        type: 'solid'
                    },
                    label: {
                        show: true,
                        position: 'end',
                        formatter: `{b}: {c}`
                    }
                }
            }
        ]
    };
    myChart.setOption(option);
    myChart.resize();
    window.addEventListener('resize', () => myChart.resize);
}
